<%@ page language="java" contentType="text/html; charset=utf8"
	pageEncoding="utf8"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">

<link href="resources/css/bootstrap.css" rel="stylesheet">
<link href="resources/css/bootstrap-responsive.css" rel="stylesheet">
<style type="text/css">
body {
	padding-top: 60px;
	padding-bottom: 40px;
	background-image: url('resources/img/bg.jpg');
}

.sidebar-nav {
	padding: 9px;
}
</style>
<title>blalbla</title>
</head>
<body>

	<div class="navbar navbar-inverse navbar-fixed-top">
		<div class="navbar-inner">
			<div class="container-fluid">
				<a class="btn btn-navbar" data-toggle="collapse"
					data-target=".nav-collapse"> <span class="icon-bar"></span> <span
					class="icon-bar"></span> <span class="icon-bar"></span>
				</a> <a class="brand " href="/index">HardShake</a>
				<div class="nav-collapse collapse">
					<form class="navbar-search pull-right">
						<input type="text" class="search-query span4"
							placeholder="Пошук коктейля">
					</form>
				</div>
				<!--/.nav-collapse -->
			</div>
		</div>
	</div>

	<div class="container-fluid">
		<div class="row-fluid">
			<div id="sidebar" class="span3">
				<div class="well sidebar-nav">
					<ul class="nav nav-list">
						<p class="nav-header">РОЗДІЛИ САЙТУ</p>
						<p>
							<a href="#" class="btn btn-inverse btn-block">Головна</a>
						</p>
						<p>
							<a href="#" class="btn btn-inverse btn-block">Коктейлі по
								алфавіт</a>
						</p>
						<p>
							<a href="#" class="btn btn-inverse btn-block">Про нас</a>
						</p>
					</ul>
				</div>
				<!--/.well -->
				<div class="well sidebar-nav">
					<ul class="nav nav-list">
						<p class="nav-header">КОРИСТУВАЧ</p>
						<p class="lead">Користувач: Гість</p>
						<p></p>
						<p>
							<a href="./login.jsp" class="btn btn-inverse btn-block">Login</a>
						</p>
					</ul>
				</div>
				<!--/.well -->
			</div>
			<!--/span-->
			<div class="span7">
				<div class="row-fluid">

					<div id="this-carousel-id" class="carousel slide">
						<!-- class of slide for animation -->
						<div class="carousel-inner">
							<div class="item active">
								<!-- class of active since it's the first item -->
								<img src="resources/img/1.jpg" alt="" class="img-rounded" />

							</div>
							<div class="item">
								<img src="resources/img/2.jpg" alt="" class="img-rounded" />

							</div>
							<div class="item">
								<img src="resources/img/3.jpg" alt="" class="img-rounded" />

							</div>
							<div class="item">
								<img src="resources/img/4.jpg" alt="" class="img-rounded" />

							</div>
						</div>
						<!-- /.carousel-inner -->
						<!--  Next and Previous controls below
        href values must reference the id for this carousel -->
						<a class="carousel-control left" href="#this-carousel-id"
							data-slide="prev">&lsaquo;</a> <a class="carousel-control right"
							href="#this-carousel-id" data-slide="next">&rsaquo;</a>
					</div>
					<!-- /.carousel -->

				</div>
				<!--div with carousel-->

				<div class="row-fluid well">


					<h2>
						<a
							href="http://upcocktail.com/molochnyj-koktejl-coffee-milkshake.html"
							class="text-warning">Молочный коктейль “Coffee Milkshake”</a>
					</h2>
					<legend></legend>

					<div class="span4">
						</br> <img
							src="http://upcocktail.com/wp-content/uploads/2011/12/Coffee-Milkshake-150x150.jpg"
							alt="Coffee Milkshake. Молочный коктейль" width="150"
							height="150" class="img-rounded"><br>
					</div>

					<div class="span6">

						<em>Состав коктейля</em>:
						<ul>
							<li>1/4 чашки очень крепкого кофе
								cvbnhbfvdsdfvgbhgyukfdhjmdfjdfjdfjfgjfgtk;</li>
							<li>1/4 чашки очень крепкого кофе;</li>
							<li>1/4 чашки очень крепкого кофе;</li>
							<li>1/4 чашки очень крепкого кофе;</li>
							<li>1/4 чашки очень крепкого кофе;</li>
							<li>1/4 чашки очень крепкого кофе;</li>
							<li>1/4 чашки очень крепкого кофе;</li>
							<li>1/4 чашки очень крепкого кофе;</li>
						</ul>
						<p>&nbsp;</p>
					</div>
					<!--/span-->
					<div class="row-fluid">


						<p>
							<legend></legend>
							<a
								href="http://upcocktail.com/molochnyj-koktejl-coffee-milkshake.html#more-435"
								class="btn pull-right">Далее</a>
						</p>

					</div>
				</div>
				<!--row-fluid-->





			</div>
			<!--/row-->
		</div>
		<!--/span-->
	</div>
	<!--/row with content -->










	<!--/.fluid-container-->
	<center>
		<i>2012</i>
	</center>
	<div style="mergin: 0px; position: absolute;">
		<img src="resources/img/footer_image.png">
	</div>


	<!-- Le javascript
    ================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->

	<script src="resources/js/jquery.js"></script>
	<script src="resources/js/bootstrap.js"></script>
	<script>
		$(function() {
			$('.carousel').carousel();
		});
	</script>




</body>
</html>